/*----------清除样式----------*/
body, div, dl, dt, dd, ul, ol, li,h1, h2, h3, h4, h5, h6, pre, code,form, fieldset, legend, input, button,textarea, p, blockquote, th, td { margin: 0;padding: 0;}
body,button, input, select, textarea { font: 12px/1.5 'Microsoft Yahei', Arial, tahoma, Srial, helvetica, sans-serif; }
h1, h2, h3, h4, h5, h6 { font-size: 100%; }
em{font-style:normal;}
a{ text-decoration:none;}
a:focus{ -moz-outline:none; outline:none;}
a {blr:expression(this.onFocus=this.blur())}
a:focus{outline:0;}
ul, ol{ list-style:none;}
img{ border:none;}

@media only screen and (max-width: 375px) {
html {
		font-size:90%!important
	}
}

@media only screen and (max-width: 320px) {
html {
		font-size:78%!important
	}
}
@media only screen and (min-width: 450px) {
html {
		font-size:100%!important
	}
}

@media screen and (max-height:416px) {
	#page7_main>header{ margin-top:5%;}
	html {
		font-size:70%!important
	}
}
/*----------首页样式----------*/
html,body{ width:100%; height: 100%; background: #304674; font-size: 100%;}
.header{ min-height: 30%; background: #2c343f url(../img/Index/header_bg.jpg) no-repeat center bottom; background-size:cover; display: flex; /*flex-direction: column;*/ flex-wrap: wrap;}
.header section{ width:36%;}
.header section:first-child{ width:32%;}
.header section:last-child{ width:32%;}
.headpicbox{ overflow: hidden;}
.headpicbox dt{ padding:7% 14%; margin-top: 15%;text-align: center; }
.headpicbox dt img{ width:6rem; height: 6rem; border-radius: 100%;}
.headpicbox dd{ text-align: center; color: #fff; font-size: 1.2rem;}
.menubox{ padding: 10%; position: relative;}
.moremenu{ float: right; color: #fff; font-size: 14px; background: url(../img/Index/iconmore.png) no-repeat left center; background-size:14px ; padding-left: 20px;}
.menubar{ background: #fafafa; border-radius: 5px; position: absolute; width:100%; right: 10px; margin-top: 30%; display: none;}
.menubar ul li{ height: 40px; line-height: 40px; text-align: center; border-bottom: 1px solid #e0e0e0;}
.menubar ul li:last-child{ border: none;}
.menubar ul li a{ display: block; font-size: 16px; color: #555;}
.menubar ul:before{ width:0; height: 0; border-left: 10px solid transparent; border-right:10px solid transparent; border-bottom: 10px solid #fff; content: ""; position: absolute; margin-top: -10px; margin-left: 40%;}

.mian{ width: 100%;}
.groupbtn{ /*background: #202833;*/ overflow: hidden; padding: 5%; border-bottom: 10px solid #1f2c51;}
.groupbtn dl{ width:25%; float: left;}
.groupbtn dl dt{ padding:3% 10%;}
.groupbtn dl dt img{ width:100%; height: 100%; border-radius: 100%;}
.groupbtn dl dd{ text-align: center; color: #fff; font-size: 16px;}
.groupbtn dl .menuactive1 img{ box-shadow:0px 0px 20px #f72d32; animation:menuactive1 3s linear infinite;}
@keyframes menuactive1 {
	0% {
		opacity:1;
		box-shadow:0px 0px 30px #f72d32;
	}
	50% {
		opacity:0.7;
		box-shadow:0px 0px 0px #f72d32;
	}
	100% {
		opacity:1;
		box-shadow:0px 0px 30px #f72d32;
	}
}

.infobox{ padding: 0 5%;}
.warningbox{ color: #f95d61; font-size: 14px; background: url(../img/Index/warningicon.png) no-repeat left center; background-size:25px auto ; padding: 5% 0 5% 35px; display:none;}
.infotitle{ padding: 2% 0; font-size: 1.1rem; color: #fff; border-bottom: 1px solid #4a5b70;}
.infocon{ padding: 3% 0;}
.infocon table{ width: 100%;}
.infocon table tr td{ color: #c4c8cc; font-size: 14px; padding: 3px 0; text-align: center;}
.infocon table tr .tdright{ text-align: right; width:25%;}
.infocon table tr .tdright
.infocon table tr .tdleft{ text-align: left; }
.infocon table tr .bluetext{ color: #14bb9f;}
.infocon .title { padding: 2% 0; font-size: 1.1rem; color: #fff; }
/*.infocon table tr .letter{ letter-spacing: 10px;}*/

/*----------安全----------*/
.min-header{ min-height: 25%;}
.divbox{ border-bottom: 10px solid #1f2c51; padding: 5%;overflow-x:auto;}
.divbox>div:first-child{ position:absolute; color:#FFF; }
.divbox>div:last-child{ margin-top:40px;height: 60px;width:400%; }
.tabbox{ width:100%;}
.tabbox ul{ padding: 5% 10%; overflow: hidden; margin: 0;}
.tabbox ul li{ width:50%; float: left; text-align: center;}
.tabbox ul li a{ display: block; border: 2px solid #0bd9b2; color: #fff; padding: 5% 0;}
.tabbox ul li:first-child a{ border-right: 0; border-radius: 5px 0 0 5px;}
.tabbox ul li:last-child a{ border-left: 0; border-radius: 0 5px 5px 0;}
.tabbox ul .active a{ background: #0bd9b2;}
.headinfobox{ width: 100%; display: flex; flex-wrap: wrap;}
.headinfobox .column{ width:33.33%; padding: 5% 0; position: relative;}

.columnpic{ width:55%; padding: 0 15%; }
.columnpic img{ width: 5rem; height: 5rem; border-radius: 100%;}
.headinfo dl{ overflow: hidden; padding-top: 15%; padding-left: 8%;}
.headinfo dl dt{ float: left;}
.headinfo dl dt img{ width:70%; height: 70%; float: left; margin-top: 6px;}
.headinfo dl dd{ float: left; color: #fff;}
.headinfo dl dd h2{ font-size: 24px; font-weight: normal; margin-bottom: 5px; float: left;}
.headinfo dl dd span{ font-size: 14px; margin-top: 10px; float: left; margin-left: 5px;}
.jrjl{ font-size: 1.05rem; position: absolute; left: 15%; bottom: 10%;font-weight: 600;}
.jrjl a{ color: #fff;}
.backhome{ font-size: 1.05rem; position: absolute; right: 15%; top: 10%;}
.backhome a{ color: #fff;}
.history{ font-size: 1.05rem; position: absolute; right: 15%; bottom: 10%;font-weight: 600;}
.history a{ color: #fff;}
.thisclass a{ color: #0bd9b2; padding-bottom: 5px; border-bottom: 1px solid #0bd9b2; font-size: 1.05rem; font-weight: 600;}
/*栅格*/
.columncenter{ width:100%; text-align: center; padding: 2% 0;}
.columncenter dl{ display:inline-block; vertical-align: middle;}
.columncenter dt{ display:inline-block; vertical-align: middle; background: #496499; color: #fff; font-size: 1rem; border-radius: 5px; line-height: 35px;}
.columncenter dd{ display:inline-block; vertical-align: middle; line-height: 35px; color: #fff;}
.pullleft{ float: left;}
.pullright{ float: right;}
.bluetext{ color: #14bb9f;}
.upbtn{ width:100%; text-align: center;}
.upbtn>div{ height:300px; }
.upbtn a{ display: block;}

.chartfooter { padding: 15px; }
.chartfooter input[type=button] { width: 20%;height: 35px;background: #0bd9b2;border: none;display: inline-block;vertical-align: middle;font-size: 1rem;color: #fff; }
.chartfooter span { color: #FFFFFF;padding-bottom: 5px;font-size: 0.5rem;font-weight: 600; }

.divcolumn10{ width: 100%;}
.divcolumn8{ width:80%;}
.divcolumn6{ width: 60%;}
.divcolumn5{ width:50%}
.divcolumn3-3{ width:33.33%}
.divcolumn2-5{ width: 25%;}
.divcolumn2{ width:20%}
.leftcolumn2{ margin-left: 20%;}

/*----------其它----------*/
.othertitle{ min-height: 10%; background: url(../img/othertitle.png) repeat-x; background-size: auto 100%; overflow: hidden;}
.othertitle h2{ color: #bbbec5; font-size: 1.1rem; font-weight: normal; margin: 5% 0 0 8%; float: left;}
.otheredit{ display: flex; flex-wrap: wrap; background: #304674;}
.otheredit section{ width:50%;}
.otheredit section:nth-child(odd){ position: relative;}
.otheredit section:nth-child(odd):after{ width: 1px; height: 100%; content: ""; background: #1c3051;  position: absolute; right: 0; top:0}
.otheredit section dl{ padding: 8%; display: flex; flex-wrap: wrap;}
.otheredit section dl dt{ width:45%; height: 45%; }
.otheredit section dl dt img{ width: 5rem; height: 5rem; border-radius: 100%;}
.otheredit section dl dd{ width: 45%; padding-left: 10%;}
.otheredit section dl dd h2{ width:100%; color: #fff; font-size: 1.1rem; font-weight: 400;}
.otheredit section dl dd em{ width:100%; display: block; color: #babbbf;}
.otheredit section dl dd span{ width:100%; display: block; font-size: 0.8rem;}
.otheredit section dl dd span a{ color: #0cd3ac;}
.otheredit section dl dd span a:first-child{ float: left;}
.otheredit section dl dd span a:last-child{ float: right;}
.otherfeedback{ background: #1f203f; padding:5% 8%; }
.addfeedbox{ width: 100%; line-height: 2rem; overflow: hidden; padding-bottom: 5%;}
.addfeedbox a{ color: #9296a1; font-size: 1.1rem; display: block;}
.addfeedbox a em{ font-size: 2rem; float: left;}
.addfeedbox a span{ padding-top: 3px; float: left;}
.otherfeedback h2{ color: #babbbf; font-size: 1.1rem; font-weight: normal; height: 20%; padding-bottom: 3%;}
.otherfeedback textarea{ width: 90%; background: #263a63; border: 0; height: 5rem; padding: 5%;color:#FFF;resize: none;}
.otherinfo{ padding: 8%; color: #babbbf;}
.otherinfo h2{ text-align: center; color: #fff; font-weight: normal; margin-bottom: 2%;}
.otherinfo p{ color: #fff; font-size: 0.8rem; line-height: 25px; text-indent: 2em;}
.feedbtn{ width: 100%; text-align: center; padding-top: 3%;}
.feedbackbtn{width:30%; height: 35px; background: #0bd9b2; border: none;  display:inline-block; vertical-align: middle; font-size: 1rem; color: #fff;border-radius: 30px;}

/*----------设置----------*/
.settitle{ min-height: 10%; background: url(../img/othertitle.png) repeat-x; background-size: auto 100%; overflow: hidden;}
.settitle h2{ color: #fff; font-size: 1.1rem; font-weight: 400; text-align: center; margin-top: 5%;}
.setbox{padding: 5%; background: #304674; border-bottom: 10px solid #171a38;}
.setswitch{width: 100%; overflow: hidden;}
.setswitch h2{  color: #fff; font-size: 1rem; font-weight: 400; float: left; text-align: left; /*padding-left: 5%;*/}
.setswitch dl{ float: right;}
.setswitch dl .switchinfo{ float: left;color: #fff; font-size: 1rem; font-weight: normal; margin-right: 15px;}
.setswitch dl dt{ margin-right: 15px;}
.setswitch dl .switchopenbtn{ width:60px; height: 23px; border:2px solid #0bd9b2; float: left; border-radius: 23px;}
.setswitch dl .switchopenbtn span{ width:23px; height: 23px; border-radius: 23px; background: #0bd9b2; content: ""; display: block;transition:0.5s;position:relative;left:0px;}
.setswitch dl .switchopenbtn input[type=checkbox] { display:none; }

.setswitch dl .switchdown{ width: 24px; height: 23px; float: left;}
.setswitch dl .downbtn{ width: 24px; height: 23px; float: left; background: url(../img/downbtn.png) no-repeat center; background-size: 21px 12px;}
.setinfo{ padding: 0 5%;}
.setinfo dl{ padding-top: 5%;}
.setinfo dl dd{ width: 100%; color: #fff; border-bottom: 1px solid #556380; padding: 4% 0; overflow: hidden;}
.setinfo dl dd .column5{ width: 50%; display: block; float: left; text-align: center;}
.setinfo dl dd .column3{ width: 30%; display: block; float: left; text-align: center;}
.setinfo dl dd .column4{ width: 40%; display: block; float: left; text-align: center;}
.setinfo dl dd a{ color: #fff;}
.setinfo dl dt{  width: 100%; color: #fff;  padding: 2% 0; overflow: hidden;}
.setinfo dl dt .column5{ width: 50%; float: right; text-align: center; font-size: 2rem;}
.setinfo dl dt .column3{ width: 30%; float: right; text-align: center; font-size: 2rem;}
.setinfo .columnAdd { width: 100%;color: #fff;padding: 2% 0;overflow: hidden; }
.setinfo .columnAdd span{ width: 30%;float: right;text-align: center;font-size: 2rem; }
.setremind{ overflow: hidden; color: #fff; line-height: 30px; padding: 5% 0% 0 0%;}
.setremind a{ color: #fff;}
.setremind .kuan{ width:50px; height: 30px; background: #283a61; display: block; margin: 0 5px; text-align: center; border-radius: 5px;}

.devicetext { width:60%;height: 38px;padding-left: 5%;margin-left:5%;border-radius: 5px;background: #DDD;border: 0; }
.deviceselect { height: 38px;padding-left: 3%;margin-left: 3%;border-radius: 5px;background: #DDD;border: 0; }

.manage_Info{ padding:5% 0;text-align:center;display:none; }
.manage_Info>span { font-size:26px;color:#626262; }
.manage_Info>hr { width:80%; }
.manage_Info select { width:40%;height: 30px;padding-left: 3%;border-radius: 5px;background: #DDD;border: 0; }
#birthday select,#holiday select{ width:25%; }
